home *** CD-ROM | disk | FTP | other *** search
/ .net (Poland) 2000 September / Magazyn_Net_09_2000 (CDB).iso / offline / R1 / lib / subnavi.js < prev   
Encoding:
JavaScript  |  2000-10-12  |  11.0 KB  |  368 lines
  1. //SUBNAVIGATION FUER R1
  2. //Programmierung: Wolfgang Mueller
  3. //Stand: 10.12.1999
  4.  
  5. var loaded=false;
  6. var firstTime=true;
  7. var Faktor;
  8. var scrollingBack;
  9. var newPosition;
  10. var currentPosition;
  11. var Abdeckung = new Array();
  12. var stopScrolling;
  13. var mausXOld;
  14. var mausX, mausY;
  15. var breakDown=60;
  16. var LaufKomponente = 4;
  17. var simpleScrolling, checkCursor;
  18. var Browser=navigator.appName.substr(0,1);                            
  19. var BildBreite = new Array();                           
  20. var plugIn = ".style";                                          
  21. var Position=0;                                                                                               
  22. var Running=false;                                                      
  23. var NaviLeiste, NaviLeiste2;
  24. var Abstand=0;
  25. var cursorSet = false;
  26. var Bildweite=0;
  27. var breite;
  28. var Differenz;
  29. var bubblingNow = false;
  30. var selected;
  31. var Bilder=new Array();
  32. var rememberPosition;
  33. var slideIn;
  34. var lockMouse = false;
  35. var aktuellesBild=0;
  36. var BildNummer;
  37. var Bereichleft, Bereichright;
  38. var BildPos = new Array();
  39. var countLength = 0;
  40. var centering = false;
  41. var status=new Array();
  42.  
  43. if (Browser=="M")
  44.         {
  45.         NaviLeiste = document.all.Bildleiste;
  46.         breite=document.body.clientWidth;
  47.         NaviLeiste2 = document.all.Bildleiste2;
  48.         Bereichleft = Math.round(breite/2) - 150;
  49.         Bereichright = Bereichleft+300;
  50.                 
  51.         for (a=1;a<NumOfImages+1;a++)
  52.                 {
  53.                 eval("BildBreite["+a+"]=document.naviBild"+a+".width;");
  54.                 if (a==1) countLength -= BildBreite[a];
  55.                 countLength += BildBreite[a];
  56.                 BildPos[a] = countLength;
  57.                 BildPos[a+NumOfImages] = BildPos[a];
  58.                 eval("Bilder["+a+"]=document.naviBild"+a+";");
  59.                 status[a] = "blur";
  60.                 status[a+NumOfImages] = "blur";
  61.                 puffer = a+NumOfImages;                
  62.                 eval("Bilder["+puffer+"]=document.naviBild"+puffer+";");
  63.                 BildBreite[a+NumOfImages] = BildBreite[a];
  64.                 Bildweite += BildBreite[a];
  65.                 }
  66.         }
  67.         
  68. if (Browser=="N")
  69.         {
  70.         breite=self.innerWidth;
  71.         Bereichleft = Math.round(breite/2) - 150;
  72.         Bereichright = Bereichleft+300;
  73.         document.captureEvents(Event.MOUSEMOVE); 
  74.         NaviLeiste = document.layers[0];
  75.         plugIn = "";
  76.         for (a=1;a<NumOfImages+1;a++)
  77.                 {
  78.                 BildBreite[a]= document.Bildleiste.document.images[a-1].width;
  79.                 if (a==1) countLength -= BildBreite[a];
  80.                 countLength += BildBreite[a];
  81.                 BildPos[a] = countLength;
  82.                 BildPos[a+NumOfImages] = BildPos[a];
  83.                 Bilder[a] = document.Bildleiste.document.images[a-1];
  84.                 status[a] = "blur";
  85.                 status[a+NumOfImages] = "blur";        
  86.                 Bilder[a+NumOfImages] = document.Bildleiste2.document.images[a-1];
  87.                 BildBreite[a+NumOfImages] = BildBreite[a];
  88.                 Bildweite += BildBreite[a];
  89.                 }
  90.         NaviLeiste2 = document.layers[1];
  91.         }       
  92.    
  93.         document.onmousemove = getCoords;       
  94.  
  95. var fuerNetscape;
  96.  
  97.         
  98. function getCoords(Ereignis)
  99. {
  100.         if (lockMouse==false)
  101.             {
  102.                 clearTimeout(checkCursor);
  103.                 clearTimeout(fuerNetscape);
  104.                 if (LaufKomponente==1) stopScrolling=true;
  105.                 mausXOld = mausX;
  106.                 if (Browser=="N") {mausX = Ereignis.pageX;mausY = Ereignis.pageY;}
  107.                 if (Browser=="M") {mausX = window.event.x;mausY = window.event.y;}
  108.                 fuerNetscape = setTimeout("clearCursor();",1500);
  109.                 if((Math.abs(mausXOld-mausX) < 30)&&stopScrolling==true) followMouse();        
  110.             }
  111. }               
  112. function unite(Welches)
  113. {        
  114.     if (loaded==true)
  115.         {
  116.         clearTimeout(checkCursor);
  117.  
  118.         if (cursorSet==false)
  119.             {
  120.             for (a=1;a<=NumOfImages;a++)
  121.                 {
  122.                 ax = a;
  123.                 if (a > NumOfImages*1.5) {ax-=NumOfImages*1.5;}
  124.                 else if (a > NumOfImages){ax-=NumOfImages;}
  125.                 else if (a > NumOfImages/2) {ax-=NumOfImages/2;}
  126.                 Bilder[a].src = "gfx/pic_menu"+ax+"_blur.jpg";
  127.                 }        
  128.             }
  129.         cursorSet=true;
  130.                 
  131.  
  132.         aktuellesBild=Welches        
  133.         BildNummer=aktuellesBild;
  134.         if (aktuellesBild > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  135.         else if (aktuellesBild > NumOfImages){ BildNummer-=NumOfImages;}
  136.         else if (aktuellesBild > NumOfImages/2) {BildNummer-=NumOfImages/2;}
  137.  
  138.         Bilder[aktuellesBild].src = "gfx/pic_menu"+BildNummer+".jpg";
  139.     
  140.     }
  141. }
  142.  
  143. function scrollBars()
  144. {
  145.  
  146.     if (firstTime==true)
  147.         {
  148.         if (cursorSet==false && stopScrolling==false)
  149.             {
  150.             for (c=1;c<=NumOfImages;c++)
  151.                 {
  152.                 if (Abstand + BildPos[c] > Bereichleft && Abstand + BildPos[c] < Bereichright)
  153.                     {
  154.                     if (status[c] == "blur")
  155.                         {
  156.                         d=c;
  157.                         if (c > NumOfImages/2) d=c-(NumOfImages/2);
  158.                         status[c] = "light";
  159.                         Bilder[c].src = "gfx/pic_menu"+d+".jpg";                        
  160.                         }
  161.                     }                    
  162.                 if (Abstand + Bildweite + BildPos[c] > Bereichleft && Abstand + Bildweite + BildPos[c] < Bereichright)
  163.                     {
  164.                     if (status[c+NumOfImages] == "blur")
  165.                         {
  166.                         d=c;
  167.                         if (c > NumOfImages/2) d=c-(NumOfImages/2);
  168.                         status[c+NumOfImages] = "light";
  169.                         Bilder[c+NumOfImages].src = "gfx/pic_menu"+d+".jpg";                        
  170.                         }                    
  171.                     }
  172.                 if (Abstand + BildPos[c]  < Bereichleft || Abstand + BildPos[c]  > Bereichright)
  173.                     {
  174.                     if (status[c] == "light")
  175.                         {
  176.                         d=c;
  177.                         if (c > NumOfImages/2) d=c-(NumOfImages/2);
  178.                         status[c] = "blur";
  179.                         Bilder[c].src = "gfx/pic_menu"+d+"_blur.jpg";                        
  180.                         }
  181.                     }                    
  182.                 if (Abstand + Bildweite + BildPos[c]< Bereichleft || Abstand + Bildweite + BildPos[c] > Bereichright)
  183.                     {
  184.                     if (status[c+NumOfImages] == "light")
  185.                         {                        
  186.                         d=c;
  187.                         if (c > NumOfImages/2) d=c-(NumOfImages/2);
  188.                         status[c+NumOfImages] = "blur";
  189.                         Bilder[c+NumOfImages].src = "gfx/pic_menu"+d+"_blur.jpg";                        
  190.                         }                    
  191.                     }                                
  192.                 }
  193.             }            
  194.         stopScrolling=false;
  195.         clearTimeout(simpleScrolling);
  196.         Abstand-=LaufKomponente;
  197.         eval("NaviLeiste"+plugIn+".left = "+Abstand+";");
  198.         eval("NaviLeiste2"+plugIn+".left = "+Abstand+"+"+Bildweite*1+";");
  199.         if (Abstand<Bildweite*(-1)) Abstand=0;  
  200.         if (cursorSet==true) 
  201.                 {       
  202.                 if (breakDown < 80) breakDown +=5;
  203.                 if (breakDown > 40) LaufKomponente=4;
  204.                 if (breakDown > 60) LaufKomponente=3;
  205.                 if (breakDown > 70) LaufKomponente=2;
  206.                 if (breakDown >= 80) LaufKomponente=1;
  207.                 }
  208.         else if (cursorSet==false) 
  209.                 {
  210.                 if (breakDown!=60) breakDown-=5;
  211.                 if (breakDown > 60) LaufKomponente=2;
  212.                 if (breakDown > 70) LaufKomponente=1;   
  213.                 if (breakDown==60) LaufKomponente=3;
  214.                 }
  215.         if (stopScrolling==false) simpleScrolling = setTimeout("scrollBars();", breakDown);    
  216.     }
  217. }
  218.  
  219. function followMouse()
  220. {
  221.  
  222.     if (mausY > 1 && mausY < 80)
  223.         {
  224.         Abstand += (mausXOld-mausX);
  225.         eval("NaviLeiste"+plugIn+".left = "+Abstand+";");
  226.         eval("NaviLeiste2"+plugIn+".left = "+Abstand+"+"+Bildweite*1+";");
  227.         if (Abstand<Bildweite*(-1)) Abstand=0;
  228.         if (Abstand>0) Abstand=Bildweite*(-1);
  229.         }
  230.     else clearCursor();
  231. }
  232.  
  233. function clearCursor()
  234. {
  235.     if (firstTime==true) 
  236.         {
  237.         checkCursor = setTimeout("clearCursorNow()", 300);
  238.         BildNummer=aktuellesBild;
  239.         if (aktuellesBild > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  240.         else if (aktuellesBild > NumOfImages){ BildNummer-=NumOfImages;}
  241.         else if (aktuellesBild > NumOfImages/2) {BildNummer-=NumOfImages/2;}
  242.  
  243.         if (aktuellesBild!=0) Bilder[aktuellesBild].src = "gfx/pic_menu"+BildNummer+"_blur.jpg";
  244.         }
  245.     if (firstTime==false) 
  246.         {
  247.         checkCursor = setTimeout("centerNavi2();",300);
  248.         BildNummer=aktuellesBild;
  249.         if (aktuellesBild > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  250.         else if (aktuellesBild > NumOfImages){ BildNummer-=NumOfImages;}
  251.         else if (aktuellesBild > NumOfImages/2) {BildNummer-=NumOfImages/2;}
  252.     
  253.         if (selected != aktuellesBild) Bilder[aktuellesBild].src = "gfx/pic_menu"+BildNummer+"_blur.jpg";
  254.         }
  255. }
  256.  
  257. function clearCursorNow()
  258. {
  259.     if (loaded==true)
  260.         {
  261.         cursorSet = false;
  262.         scrollBars();
  263.         }
  264. }       
  265.  
  266. function filter(Was)
  267. {    
  268.      centerNavi(Was);
  269. }
  270.  
  271. function centerNavi(Welche)
  272. {    
  273.         stopScrolling=true;
  274.         
  275.         if (firstTime==true)
  276.             {        
  277.             for (a=1;a<(NumOfImages*2)+1;a++)
  278.                 {
  279.                 BildNummer=a;
  280.                 if (BildNummer > NumOfImages*1.5) BildNummer-=NumOfImages*1.5;
  281.                 if (BildNummer > NumOfImages) BildNummer-=NumOfImages;
  282.                 if (BildNummer > NumOfImages/2) BildNummer-=NumOfImages/2;                    
  283.                 eval("Bilder["+a+"].src = 'gfx/pic_menu"+BildNummer+"_blur.jpg';");
  284.                 }
  285.             }
  286.         if (firstTime==false)
  287.             {
  288.             BildNummer=selected;
  289.             if (selected > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  290.             else if (selected > NumOfImages){ BildNummer-=NumOfImages;}
  291.             else if (selected > NumOfImages/2) {BildNummer-=NumOfImages/2;}    
  292.             
  293.             Bilder[selected].src = "gfx/pic_menu"+BildNummer+"_blur.jpg";        
  294.             }
  295.  
  296.         lockMouse = true;
  297.         setTimeout("lockMouse=false;",1000);
  298.         firstTime=false;
  299.         Differenz=0;
  300.         clearTimeout(simpleScrolling);
  301.         
  302.         aktuellesBild=Welche;
  303.         BildNummer=aktuellesBild;
  304.         if (aktuellesBild > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  305.         else if (aktuellesBild > NumOfImages){ BildNummer-=NumOfImages;}
  306.         else if (aktuellesBild > NumOfImages/2) {BildNummer-=NumOfImages/2;}
  307.         
  308.         Bilder[aktuellesBild].src = "gfx/pic_menu"+BildNummer+"_blur.jpg";                
  309.         if (Welche<NumOfImages/2) Welche+=NumOfImages/2;
  310.         if (Welche>(NumOfImages*1.5)-1) Welche-=NumOfImages/2;
  311.         
  312.         selected = Welche;
  313.         aktuellesBild=Welche;
  314.         BildNummer=aktuellesBild;
  315.         if (aktuellesBild > NumOfImages*1.5) {BildNummer-=NumOfImages*1.5;}
  316.         else if (aktuellesBild > NumOfImages){ BildNummer-=NumOfImages;}
  317.         else if (aktuellesBild > NumOfImages/2) {BildNummer-=NumOfImages/2;}
  318.         Bilder[aktuellesBild].src = "gfx/pic_menu"+BildNummer+".jpg";        
  319.         
  320.         for (a=1;a<Welche+1;a++) {Differenz += BildBreite[a];}         
  321.         newPosition=(Differenz-Math.round(breite/2)-Math.round(BildBreite[Welche]/2))*-1;
  322.         currentPosition = Abstand;
  323.         if (newPosition < currentPosition) Faktor = -1;
  324.         if (newPosition > currentPosition) Faktor = 1;    
  325.         slideIn=40;    
  326.         scrollNaviBack();    
  327. }
  328.  
  329. function centerNavi2()
  330. {
  331.  
  332.         cursorSet=false;
  333.         if (Abstand < newPosition-40 || Abstand > newPosition+40)
  334.             {
  335.             if (newPosition < Abstand) Faktor = -1;
  336.             if (newPosition > Abstand) Faktor = 1;        
  337.             slideIn=20;        
  338.             scrollNaviBack();
  339.             }
  340. }
  341.  
  342. function scrollNaviBack()
  343. {
  344.         if (Faktor==-1){
  345.             if (Abstand > newPosition)            
  346.                 {
  347.                 Abstand -= slideIn;
  348.                 eval("NaviLeiste"+plugIn+".left = "+Abstand+";");
  349.                 eval("NaviLeiste2"+plugIn+".left = "+Abstand+"+"+Bildweite*1+";");    
  350.                 scrollingBack = setTimeout("scrollNaviBack();",1);
  351.                 }
  352.             }
  353.         if (Faktor==1){
  354.             if (Abstand < newPosition)            
  355.                 {
  356.                 Abstand += slideIn;
  357.                 eval("NaviLeiste"+plugIn+".left = "+Abstand+";");
  358.                 eval("NaviLeiste2"+plugIn+".left = "+Abstand+"+"+Bildweite*1+";");    
  359.                 scrollingBack = setTimeout("scrollNaviBack();",1);
  360.                 }
  361.             }
  362. }
  363.  
  364.  
  365.  
  366. scrollBars();
  367.                 
  368.